@use './variables' as *;

// Element UI 样式覆盖

// 卡片
.el-card {
  &.is-always-shadow {
    box-shadow: $box-shadow-light;
  }
  
  &__header {
    padding: 15px 20px;
    border-bottom: 1px solid $border-lighter;
  }
  
  &__body {
    padding: 20px;
  }
}

// 表格
.el-table {
  th {
    background-color: $background-base;
    color: $text-regular;
    
    &.is-leaf {
      border-bottom: 1px solid $border-lighter;
    }
  }
  
  td {
    color: $text-regular;
  }
}

// 分页
.el-pagination {
  padding: 20px 0;
  text-align: right;
  
  .btn-prev,
  .btn-next {
    padding: 0;
    min-width: 32px;
    height: 32px;
    line-height: 32px;
  }
  
  .el-pager li {
    min-width: 32px;
    height: 32px;
    line-height: 32px;
  }
}

// 表单
.el-form {
  .el-form-item {
    margin-bottom: 22px;
    
    &__label {
      color: $text-regular;
      padding-right: 12px;
    }
  }
}

// 按钮
.el-button {
  &--text {
    padding: 0;
  }
  
  [class*="el-icon-"] + span {
    margin-left: 5px;
  }
}

// 对话框
.el-dialog {
  border-radius: $border-radius-base;
  
  &__header {
    padding: 15px 20px;
    border-bottom: 1px solid $border-lighter;
  }
  
  &__body {
    padding: 20px;
  }
  
  &__footer {
    padding: 15px 20px;
    border-top: 1px solid $border-lighter;
  }
}

// 标签
.el-tag {
  &+.el-tag {
    margin-left: 8px;
  }
}

// 消息提示
.el-message {
  min-width: 300px;
  padding: 12px 15px;
  box-shadow: $box-shadow-light;
  
  &--success {
    background-color: #f0f9eb;
    border-color: #e1f3d8;
  }
  
  &--warning {
    background-color: #fdf6ec;
    border-color: #faecd8;
  }
  
  &--error {
    background-color: #fef0f0;
    border-color: #fde2e2;
  }
} 